﻿<?xml version="1.0" encoding="utf-8" ?> 
<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:local="clr-namespace:Microsoft.PlayerFramework.CaptionSettings"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vc="clr-namespace:Microsoft.PlayerFramework.CaptionSettings.ValueConverters"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    mc:Ignorable="d">
    <vc:FontFamilyConverter x:Key="FontFamilyConverter"/>
    <vc:FontStyleConverter x:Key="FontStyleConverter"/>
    <vc:FontSizeConverter x:Key="FontSizeConverter" BaseFontSize="24"/>
    <vc:ResourceConverter x:Key="ResourceConverter"/>
    <vc:ColorConverter x:Key="ColorConverter"/>
    <DataTemplate x:Key="FontFamilyTemplate">
        <Grid Margin="0,10">
            <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="FontSizeTemplate">
        <Grid Margin="0,10">
            <TextBlock Text="{Binding Mode=OneWay, TargetNullValue=Default}" Style="{StaticResource PhoneTextNormalStyle}"/>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="FontStyleTemplate">
        <Grid Margin="0,10">
            <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="ColorTypeTemplate">
        <Grid Margin="0,10">
            <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="ColorTemplate">
        <Rectangle Margin="10,10" Stroke="White"
                    Fill="{Binding Converter={StaticResource ColorConverter}}"
                    StrokeThickness="2"/>
    </DataTemplate>
    <Style x:Key="CaptionSettingsPageTitleStyle" BasedOn="{StaticResource PhoneTextBlockBase}" TargetType="TextBlock"/>
    <Style x:Key="PreviewTextStyle" TargetType="TextBlock">
        <Setter Property="Text" Value="Aaa Bbb Ccc Ddd"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="TextTrimming" Value="WordEllipsis"/>
        <Setter Property="TextAlignment" Value="Center"/>
    </Style>
    <Style x:Key="ColorButtonStyle" TargetType="Button">
        <Setter Property="Width" Value="70"/>
    </Style>
    <Style TargetType="local:CaptionSettingsControl">
        <Setter Property="Background" Value="{StaticResource PhoneSemitransparentBrush}"/>
        <Setter Property="PreviewVisibility" Value="Visible"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:CaptionSettingsControl">
                    <Grid x:Name="LayoutRoot">
                        <Grid.Resources>
                            <DataTemplate x:Key="FontFamilyTemplate">
                                <Grid Margin="0,10">
                                    <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
                                </Grid>
                            </DataTemplate>
                            <DataTemplate x:Key="FontSizeTemplate">
                                <Grid Margin="0,10">
                                    <TextBlock Text="{Binding Mode=OneWay, TargetNullValue=Default}" Style="{StaticResource PhoneTextNormalStyle}"/>
                                </Grid>
                            </DataTemplate>
                            <DataTemplate x:Key="FontStyleTemplate">
                                <Grid Margin="0,10">
                                    <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
                                </Grid>
                            </DataTemplate>
                            <DataTemplate x:Key="ColorTypeTemplate">
                                <Grid Margin="0,10">
                                    <TextBlock Text="{Binding Converter={StaticResource ResourceConverter}, Mode=OneWay}" Style="{StaticResource PhoneTextNormalStyle}"/>
                                </Grid>
                            </DataTemplate>
                            <DataTemplate x:Key="ColorTemplate">
                                <Rectangle Margin="10,10" Stroke="White"
                    Fill="{Binding Converter={StaticResource ColorConverter}}"
                    StrokeThickness="2"/>
                            </DataTemplate>
                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ListGroup">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0.2"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="ListHidden"/>
                                <VisualState x:Name="ListShown">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" Storyboard.TargetName="ListSelector">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>True</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ListSelector" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="PreviewStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0.5"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Default">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="TopLeft">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Top">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="TopRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Left">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Right">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomLeft">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Bottom">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="None"/>
                                <VisualState x:Name="RaisedEdge">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Right">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Bottom">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Right" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Bottom" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.ZIndex)" Storyboard.TargetName="Right">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>-1</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.ZIndex)" Storyboard.TargetName="Bottom">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>-1</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.ZIndex)" Storyboard.TargetName="BottomRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>-1</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="Bottom" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="Right" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="DepressedEdge">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="TopLeft">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Top">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Left">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="TopLeft" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Top" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Left" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="-1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="TopLeft" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="-1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="TopLeft" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="-1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="Top" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="-1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="Left" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Outline">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="TopLeft">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Top">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="TopRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Left">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Right">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomLeft">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Bottom">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="DropShadow">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Right">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Bottom">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BottomRight">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation Duration="0" To="2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="Right" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="Bottom" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Right" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Bottom" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="BottomRight" d:IsOptimized="True"/>
                                        <DoubleAnimation Duration="0" To="0.4" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="OutlineEdges" d:IsOptimized="True"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="OrientationStates">
                                <VisualState x:Name="Portrait">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.RowSpan)" Storyboard.TargetName="Preview">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>1</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.Column)" Storyboard.TargetName="Preview">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>0</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.ColumnSpan)" Storyboard.TargetName="Preview">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>2</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.Row)" Storyboard.TargetName="scrollViewer">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>2</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.ColumnSpan)" Storyboard.TargetName="scrollViewer">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>2</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.RowSpan)" Storyboard.TargetName="scrollViewer">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Int32>1</System:Int32>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="Preview">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Thickness>10,0,0,20</Thickness>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Landscape"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>

                        <!--TitlePanel contains the name of the application and page title-->
                        <StackPanel Grid.Row="0" Margin="12,17,0,28" Background="{TemplateBinding Background}">
                            <TextBlock x:Name="PageTitle" Text="CAPTION SETTINGS" Style="{StaticResource CaptionSettingsPageTitleStyle}"/>
                        </StackPanel>

                        <!--ContentPanel - place additional content here-->
                        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="1.5*"/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>

                            <Border Background="{TemplateBinding Background}" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" >
                                <CheckBox Content="Ignore default caption fonts and colors" IsChecked="{Binding IsEnabled, Mode=TwoWay}"/>
                            </Border>
                            <ScrollViewer x:Name="scrollViewer" Background="{TemplateBinding Background}" VerticalAlignment="Top" Grid.Row="1" Padding="0,0,10,0" Grid.RowSpan="2">

                                <StackPanel>
                                    <TextBlock Text="Font" Style="{StaticResource PhoneTextGroupHeaderStyle}"/>
                                    <StackPanel Margin="10,0,0,0">
                                        <TextBlock Text="Family" Style="{StaticResource PhoneTextNormalStyle}"/>
                                        <Button x:Name="FontFamilyButton" Content="{Binding Settings.FontFamily, Converter={StaticResource ResourceConverter}, TargetNullValue=Default, ConverterParameter=lower}" IsEnabled="{Binding IsEnabled}"/>
                                        <TextBlock Text="Size (%)" Style="{StaticResource PhoneTextNormalStyle}" />
                                        <Button x:Name="FontSizeButton" Content="{Binding Settings.FontSize, TargetNullValue=Default}" IsEnabled="{Binding IsEnabled}"/>
                                        <TextBlock Text="Font Style" Style="{StaticResource PhoneTextNormalStyle}" />
                                            <Button x:Name="FontStyleButton" Content="{Binding Settings.FontStyle, Converter={StaticResource ResourceConverter}, TargetNullValue=Default, ConverterParameter=lower}" IsEnabled="{Binding IsEnabled}" />
                                    </StackPanel>
                                    <TextBlock Text="Color" Style="{StaticResource PhoneTextGroupHeaderStyle}" Margin="12,0,0,0" />
                                    <StackPanel Margin="10,0,0,0">
                                        <TextBlock Text="Font" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0,0,0"/>
                                        <Grid Margin="0">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition/>
                                                <ColumnDefinition Width="Auto"/>
                                            </Grid.ColumnDefinitions>
                                                <Button x:Name="FontColorTypeButton" Content="{Binding FontColorType, Converter={StaticResource ResourceConverter}, ConverterParameter=lower}" IsEnabled="{Binding IsEnabled}"/>
                                            <Button x:Name="FontColorButton" Grid.Column="1" IsEnabled="{Binding IsFontColorEnabled, Mode=OneWay}" Background="{Binding Settings.FontColor, Converter={StaticResource ColorConverter}, ConverterParameter=White}" Style="{StaticResource ColorButtonStyle}"/>
                                        </Grid>
                                        <TextBlock Text="Background" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0,0,0"/>
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition/>
                                                <ColumnDefinition Width="Auto"/>
                                            </Grid.ColumnDefinitions>
                                                <Button x:Name="BackgroundColorType" Content="{Binding BackgroundColorType, Converter={StaticResource ResourceConverter}, ConverterParameter=lower}" IsEnabled="{Binding IsEnabled}" />
                                            <Button x:Name="BackgroundColorButton" Grid.Column="1" IsEnabled="{Binding IsBackgroundColorEnabled, Mode=OneWay}" Background="{Binding Settings.BackgroundColor, Converter={StaticResource ColorConverter}}" Style="{StaticResource ColorButtonStyle}"/>
                                        </Grid>
                                        <TextBlock Text="Window" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0,-118,0"/>
                                        <Grid >
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition/>
                                                <ColumnDefinition Width="Auto"/>
                                            </Grid.ColumnDefinitions>
                                                <Button x:Name="WindowColorType" Content="{Binding WindowColorType, Converter={StaticResource ResourceConverter}, ConverterParameter=lower}" IsEnabled="{Binding IsEnabled}" />
                                            <Button x:Name="WindowColorButton" Grid.Column="1" IsEnabled="{Binding IsWindowColorEnabled, Mode=OneWay}" Background="{Binding Settings.WindowColor, Converter={StaticResource ColorConverter}}" Style="{StaticResource ColorButtonStyle}"/>
                                        </Grid>
                                    </StackPanel>
                                </StackPanel>
                            </ScrollViewer>
                            <Border x:Name="Preview" Background="{TemplateBinding Background}" Visibility="{TemplateBinding PreviewVisibility}" 
                                    Padding="0,0,10,10"
                                    Grid.Column="1" Grid.Row="1"
                                    VerticalAlignment="Top" IsHitTestVisible="False" Grid.RowSpan="2">
                                <Grid Background="Gray">
                                <Border x:Name="PreviewWindow" BorderThickness="1" Margin="10" Padding="10" Background="{Binding Settings.WindowColor, Converter={StaticResource ColorConverter}}">
                                    <Border x:Name="PreviewBackground" BorderThickness="1" Padding="10" Background="{Binding Settings.BackgroundColor, Converter={StaticResource ColorConverter}}">
                                        <Grid x:Name="PreviewTextElements" CacheMode="BitmapCache">
                                            <Grid x:Name="OutlineEdges">
                                                <TextBlock x:Name="TopLeft" Style="{StaticResource PreviewTextStyle}" Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									Foreground="Black" FontSize="{Binding FontSize, ElementName=Center}" VerticalAlignment="Stretch"
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="-1" TranslateY="-1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="Top" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateY="-1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="TopRight" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="1" TranslateY="-1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="Left" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="-1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="Right" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="BottomLeft" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="-1" TranslateY="1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="Bottom" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
									Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateY="1"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                                <TextBlock x:Name="BottomRight" Style="{StaticResource PreviewTextStyle}" 
									FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
									FontSize="{Binding FontSize, ElementName=Center}" 
									FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
                                    Text="{Binding PreviewText}" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" Foreground="Black" VerticalAlignment="Stretch">
                                                    <TextBlock.RenderTransform>
                                                        <CompositeTransform TranslateX="0" TranslateY="0"/>
                                                    </TextBlock.RenderTransform>
                                                </TextBlock>
                                            </Grid>
                                            <TextBlock x:Name="Center" 
                                Style="{StaticResource PreviewTextStyle}"
                                FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
                                FontStyle="{Binding Settings.FontFamily, Converter={StaticResource FontStyleConverter}}"
                                Text="{Binding PreviewText}" 
								Foreground="{Binding Settings.FontColor, ConverterParameter=White, Converter={StaticResource ColorConverter}}" 
								FontSize="{Binding Settings.FontSize, Converter={StaticResource FontSizeConverter}}" VerticalAlignment="Stretch"/>
                                            <!--<TextBlock x:Name="SmallCapsTest" 
                                Style="{StaticResource PreviewTextStyle}"
                                FontFamily="{Binding Settings.FontFamily, Converter={StaticResource FontFamilyConverter}}"
                                Text="{Binding PreviewText}" FontSize="40" Foreground="Red"/>-->
                                        </Grid>
                                    </Border>
                                </Border>
                            </Grid>
                            </Border>
                        </Grid>
                        <phone:LongListSelector x:Name="ListSelector" GridCellSize="160,160" Grid.Row="1" ItemTemplate="{StaticResource FontFamilyTemplate}" ItemsSource="{Binding FontFamilies}" Opacity="0" IsHitTestVisible="False" Padding="12,0,0,0" d:IsHidden="True">
                            <phone:LongListSelector.Background>
                                <SolidColorBrush Color="{StaticResource PhoneBackgroundColor}"/>
                            </phone:LongListSelector.Background>
                            <phone:LongListSelector.Foreground>
                                <SolidColorBrush Color="{StaticResource PhoneForegroundColor}"/>
                            </phone:LongListSelector.Foreground>
                        </phone:LongListSelector>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    
</ResourceDictionary>